<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>照片墙</title>
    <style type="text/css">
        body{
            background-color: #aaaaaa;
        }
 #div1{
     height: 600px;
     width: 1000px;
     padding-top: 100px;
     margin: auto;
 }
img{
    margin-right: 20px;
    margin-bottom: 20px;
    height:260px;
    padding:10px;
    background-color: #FFFFFF;
    transform: rotate(-20deg);
}
        img:hover{
            transform: rotate(0deg) scale(1.5);
            transition: 3s;
        }
    </style>
</head>
<body>
<div id="div1">
    <div id="div1_top">
        <img src="image/a7.jpg">
        <img src="image/a7.jpg">
        <img src="image/a7.jpg">
        <img src="image/a7.jpg">


    </div>
    <div id="div1_bottom">
        <img src="image/a7.jpg">
        <img src="image/a7.jpg">
        <img src="image/a7.jpg">
        <img src="image/a7.jpg">

    </div>
</div>
</body>
</html>